<template>
  <div class="s-switch">
    <p :style="{fontSize: cusFontSize?`${cusFontSize}px`:'var(--settingTitleFontSize)'}">{{title}}</p>
    <n-switch v-model:value="active" @update:value="handleChange">123</n-switch>
  </div>
</template>

<script setup>
import { NSwitch } from  'naive-ui'
import {defineEmits, defineProps, ref} from 'vue'
let props = defineProps(['title', 'cusFontSize'])
let { title, cusFontSize } = props
let active = ref(false)
let emit = defineEmits(['update:modelValue'])
function handleChange(e) {
  emit('update:modelValue', e)
}
</script>

<style scoped>
@import "@/style/setting.css";
.s-switch {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
</style>
